<template>
	<view style="padding: 32rpx;">
	
	  <view style="display: flex; background: #f1f1f1; padding: 32rpx; align-items: center;">
	    <uni-icons type="person-filled" size="72"></uni-icons>
	    <view style="padding: 0 0 0 40rpx;" v-if="userInfo">
	      <view>{{ userInfo.userName }}</view>
	    </view>
	    <view style="padding: 0 0 0 40rpx;" v-else>
	      <view>游客</view>
	      <view style="text-decoration: underline; padding: 16rpx 0 0 0;" @tap="goLogin">点击登录</view>
	    </view>
	  </view>
	
	  <view style="margin-top: 32rpx;">
		<uni-list>
		  	<uni-list-item title="设置" link></uni-list-item>
		  	<uni-list-item title="注销" @click="doLogout" link></uni-list-item>
		</uni-list>
	  </view>
	
	</view>
</template>

<script>
	import { USER_INFO } from '../../common/constant/cacheKeys'
	import { getCache, removeCache } from '../../common/utils/cache'
	export default {
		data() {
			return {
				userInfo: null
			}
		},
		onLoad() {},
		async onShow () {
		    const userInfo = await getCache(USER_INFO)
		    this.userInfo = userInfo
		},
		methods: {
			goLogin () {
				uni.navigateTo({ url: '/pages/login/index' })
			},
			doLogout () {
				removeCache(USER_INFO)
				this.userInfo = null
			}
		}
	}
</script>

<style></style>
